<template>
  <div>
    <!-- 搜索区域 -->
    <SelfAdaption>
      <Form
        :model="searchForm"
        ref="modelForm"
        slot="adaption-bar"
        label-position="top"
        class="ivu-form-no-margin-bottom"
        inline
      >
        <template>
          <Form-item prop="resourceCode" :label="$t('module.tenantManage.code')">
            <Input
              type="text"
              :maxlength="30"
              v-model.trim="searchForm.resourceCode"
              placeholder
              
              @on-enter="search"
            ></Input>
          </Form-item>
          <Form-item prop="resourceName" :label="$t('module.tenantManage.name')">
            <Input
              type="text"
              :maxlength="30"
              v-model.trim="searchForm.resourceName"
              placeholder
              
              @on-enter="search"
            ></Input>
          </Form-item>
          <Form-item prop="resourceUrl" :label="$t('module.tenantManage.requestUrl')">
            <Input
              type="text"
              :maxlength="30"
              v-model.trim="searchForm.resourceUrl"
              placeholder
              
              @on-enter="search"
            ></Input>
          </Form-item>
          <!-- 查询\重置按钮 -->
          <Form-item prop="button" class="search-solt-btn">
            <RPButton optType="search" @click="search" />
            <RPButton optType="reset" @click="reset" />
          </Form-item>
        </template>
      </Form>
    </SelfAdaption>
    <InnerPageTable ref="resourceTable" :config="tableConfig" @page-change="pageChanged">
      <!-- 添加 -->
      <div slot="table-bar">
        <RPButton optType="create" @click="addOrEdit('add')" />
      </div>
    </InnerPageTable>
  </div>
</template>

<script>
import { resourceManageColumns } from './columns.js'
import { resourceList, deleteResource } from '@api/flowable/tenantManage.js'
import resourceEdit from './resourceEdit.vue'
export default {
  name: 'resourceManage',
  data() {
    return {
      searchForm: {
        resourceCode: '',
        resourceName: '',
        resourceUrl: ''
      },
      tableConfig: {
        loadDataFn: ({ responseProcess, param }) => {
          resourceList(param).then(({ data }) => {
            data.currentPage = data.pageNum
            delete data.pageNum
            data.recordCount = data.total
            delete data.total
            data.recordList = data.records
            delete data.records
            responseProcess(data)
          })
        },
        columnsFn: resourceManageColumns.bind(this),
        autoFirst: true
      },
      rules: []
    }
  },
  methods: {
    search() {
      this.$refs['resourceTable'].load(this.searchForm)
    },
    reset() {
      this.$refs['modelForm'].resetFields()
      this.search()
    },
    pageChanged(page) {
      this.currentPage = page
    },
    addOrEdit(row) {
      new this.$pageModal(
        resourceEdit,
        {
          props: {
            resourceInfo: row == 'add' ? {} : row
          }
        },
        data => {
          if (data && row.id) {
            this.$refs['resourceTable'].load(this.searchForm, this.currentPage)
          } else if (data) {
            this.search()
          }
        }
      )
    },
    deleteRes(row) {
      new $confirm(this.$t('common.warning.confirmToDelete'), this).then(() => {
        deleteResource({ id: row.id }).then(res => {
          this.$Message.success({
            content: this.$t('common.deleteSuccess'),
            duration: 3
          })
          this.search()
        })
      })
    }
  }
}
</script>

<style>
</style>